<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8">

    <script src="echarts.min.js"></script>
    <script src="shine.js"></script>
    <script src="Chart.js"></script>
</head>

<body>
<style>
        html,
        body,
        #main {
            width: 100%;
            height: 100%;
            margin: 0;
            padding: 0;
        }
    </style>
<div id="main"></div>
<script type="text/javascript">
        function loadPieChart(chartProtocol) {

            var pieChart = echarts.init(document.getElementById('main'), 'shine')

            refreshPieChart(pieChart, chartProtocol)

            return pieChart
        }

        function loadBarChart(chartProtocol) {

            var barChart = echarts.init(document.getElementById('main'), 'shine')

            refreshBarChart(barChart, chartProtocol, true)

            return barChart
        }

        function loadHorizontalBarChart(chartProtocol) {

            var barChart = echarts.init(document.getElementById('main'), 'shine')

            refreshBarChart(barChart, chartProtocol, false)

            return barChart
        }

        function loadLineBarChart(chartProtocol) {

            var lineChart = echarts.init(document.getElementById('main'), 'shine')

            refreshLineBarChart(lineChart, chartProtocol)

            return lineChart
        }

        function loadLineChart(chartProtocol) {

            var lineChart = echarts.init(document.getElementById('main'), 'shine')

            refreshLineChart(lineChart, chartProtocol)

            return lineChart
        }

        function loadChart(chartProtocol) {

            var chart

            if (chartProtocol['widgettype'] == 'bar') {

                chart = loadBarChart(chartProtocol)
            }
            else if (chartProtocol['widgettype'] == 'horizontalbar') {

                chart = loadHorizontalBarChart(chartProtocol)
            }
            else if (chartProtocol['widgettype'] == 'line') {

                chart = loadLineChart(chartProtocol)
            }
            else if (chartProtocol['widgettype'] == 'pie') {

                chart = loadPieChart(chartProtocol)
            }
            else if (chartProtocol['widgettype'] == 'linebar') {

                chart = loadLineBarChart(chartProtocol)
            }

            window.addEventListener("resize", function () {

                chart.resize()
            })
        }


    <!--window.onload = function(){-->
        <!--window.lifecycle.onReady();-->
    <!--}-->
    </script>
</body>

</html>
